/**
 * Created by Administrator on 2014/12/21.
 */

var WINDOW_WIDTH = 1024;
var WINDOW_HEIGHT = 768;
var REDIS = 6;
var JU = REDIS / 10;
var topX = 15;
var topY = 15;

const endTime = new Date(2014, 11, 25);
var curShowTimeSeconds = 0;
var hours = 0;
var minutes = 0;
var seconds = 0;

/*
 var ball = {x: 512, y: 100, r: REDIS, g: .3, vx: -1, vy: -2, color: "blue"};
 */
var balls = [];
const colors = ["#33B5E5", "#0099CC", "#AA66CC", "#9933CC", "#99CC00", "#669900", "#FFBB33", "#FF8800", "#FF4444", "#CC0000"]
var renderDigit = function (x, y, num, context) {
    context.fillStyle = "rgba(233,102,153,1)";
    for (var i = 0; i < digit[num].length; i++) {
        for (var j = 0; j < digit[num][i].length; j++) {
            if (digit[num][i][j] == 1) {
                context.beginPath();
                context.arc(x + j * 2 * (REDIS + JU) + REDIS + JU, y + i * 2 * ( REDIS + JU) + REDIS + JU, REDIS, 0, 2 * Math.PI);
                context.closePath();
                context.fill()
            }
        }
    }
}
var renderBall = function (context) {
    for (var key in balls) {
        context.fillStyle = balls[key].color;
        context.beginPath();
        context.arc(balls[key].x, balls[key].y, balls[key].r, 0, 2 * Math.PI);
        context.closePath();
        context.fill()
    }
};
var render = function (context) {
    context.clearRect(0, 0, context.canvas.width, context.canvas.height);
    renderDigit(topX, topY, parseInt(hours / 10), context);
    renderDigit(topX + 15 * (REDIS + JU), topY, parseInt(hours % 10), context);
    renderDigit(topX + 30 * (REDIS + JU), topY, 10, context);
    renderDigit(topX + 39 * (REDIS + JU), topY, parseInt(minutes / 10), context);
    renderDigit(topX + 54 * (REDIS + JU), topY, parseInt(minutes % 10), context);
    renderDigit(topX + 69 * (REDIS + JU), topY, 10, context);
    renderDigit(topX + 78 * (REDIS + JU), topY, parseInt(seconds / 10), context);
    renderDigit(topX + 93 * (REDIS + JU), topY, parseInt(seconds % 10), context);
    renderBall(context);
};

var addBalls = function (x, y, num) {
    for (var i = 0; i < digit[num].length; i++) {
        for (var j = 0; j < digit[num][i].length; j++) {
            if (digit[num][i][j] == 1) {
                var ball = {
                    x: x + j * 2 * (REDIS + JU) + REDIS + JU,
                    y: y + i * 2 * ( REDIS + JU) + REDIS + JU,
                    r: REDIS,
                    g: 1.5 + Math.random(),
                    vx: Math.pow(-1, Math.ceil(Math.random() * 1000)) * REDIS / 5,
                    vy: -3,
                    color: colors[Math.floor(Math.random() * colors.length)]
                };
                balls.push(ball);

            }
        }
    }
}

var updateBalls = function () {
    var count = balls.length - 1;
    for (var key = balls.length - 1; key >= 0; key--) {
        //console.log("ball:" + balls[key]);
        if (balls.length - count >= 1500) {
            balls.shift();
            continue;
        }
        balls[key].x += balls[key].vx;
        balls[key].y += balls[key].vy;
        balls[key].vy += balls[key].g * .65;

        if (balls[key].y >= WINDOW_HEIGHT - balls[key].r) {
            balls[key].y = WINDOW_HEIGHT - balls[key].r;
            balls[key].vy = -balls[key].vy * .65;
        }
        if (balls[key].x > REDIS) {
            balls[count] = balls[key];
            count--;
        }

    }
}

var update = function () {
    var nextShowTimeSeconds = getCurrentShowTimeSeconds();
    var curSeconds = curShowTimeSeconds % 60;
    var nextSeconds = nextShowTimeSeconds % 60;
    if (nextSeconds != curSeconds) {
        var nextHours = parseInt(nextShowTimeSeconds / 3600);
        var nextMinutes = parseInt((nextShowTimeSeconds - nextHours * 3600) / 60);
        curShowTimeSeconds = nextShowTimeSeconds;

        if (parseInt(nextHours / 10) != parseInt(hours / 10)) {
            addBalls(topX, topY, parseInt(hours / 10));
        }
        if (parseInt(nextHours % 10) != parseInt(hours % 10)) {
            addBalls(topX + 15 * (REDIS + JU), topY, parseInt(hours % 10));
        }
        if (parseInt(nextMinutes / 10) != parseInt(minutes / 10)) {
            addBalls(topX + 39 * (REDIS + JU), topY, parseInt(minutes / 10));
        }
        if (parseInt(nextMinutes % 10) != parseInt(minutes % 10)) {
            addBalls(topX + 54 * (REDIS + JU), topY, parseInt(minutes % 10));
        }
        if (parseInt(nextSeconds / 10) != parseInt(seconds / 10)) {
            addBalls(topX + 78 * (REDIS + JU), topY, parseInt(seconds / 10));
        }
        addBalls(topX + 93 * (REDIS + JU), topY, parseInt(seconds % 10));
        hours = parseInt(curShowTimeSeconds / 3600);
        minutes = parseInt((curShowTimeSeconds - hours * 3600) / 60);
        seconds = curShowTimeSeconds % 60;
    }
    updateBalls();
}
window.onload = function () {
    var canvas = document.getElementById("canvas");
    WINDOW_WIDTH = window.innerWidth;
    WINDOW_HEIGHT = window.innerHeight;
    topX = Math.round(WINDOW_WIDTH / 10);
    topY = Math.round(WINDOW_HEIGHT / 3);

    REDIS = Math.round(WINDOW_WIDTH * 4 / 5 / 108) - 1;
    var context = canvas.getContext("2d");
    canvas.width = WINDOW_WIDTH;
    canvas.height = WINDOW_HEIGHT;
    setInterval(function () {
        update();
        render(context);
        console.log(balls.length)
    }, 50);
}

var getCurrentShowTimeSeconds = function () {
    var curTime = new Date();
    var ret = endTime.getTime() - curTime.getTime();
    ret = Math.round(ret / 1000);
    return ret >= 0 ? ret : 0;
}